<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>文章评论</title>
</head>

<div data-v-6d176b95="" class="introduce-info"><div data-v-6d176b95="" class="introduce-title">MongoDB最热门NoSql数据库</div> <div data-v-79fe75fe="" data-v-6d176b95="" class="" style="display: none;"><div data-v-79fe75fe="" class="version-select"><span data-v-79fe75fe="" class="input-label">往期课程</span> <span data-v-79fe75fe="" class="select-input"><span data-v-79fe75fe="">MongoDB最热门NoSql数据库</span> <i data-v-79fe75fe="" class="el-icon-arrow-down"></i></span> <div data-v-79fe75fe="" class="select-list" style="display: none;"><div data-v-79fe75fe="" class="list-item actiVeversion">
    MongoDB最热门NoSql数据库
</div></div></div></div> <div data-v-6d176b95="" class="info-bottom"><!----> <div data-v-6d176b95="" class="introduce-hint"><div data-v-6d176b95="" class="hint-box"><div data-v-6d176b95=""><span data-v-6d176b95="">课时：</span>17节
</div> <div data-v-6d176b95=""><span data-v-6d176b95="">课程难度：</span>中级</div> <div data-v-6d176b95=""><span data-v-6d176b95="">学习人数：</span>132人
</div></div> <div data-v-04ce5dcc="" data-v-6d176b95=""><div data-v-04ce5dcc="" class="price-nav"><div data-v-04ce5dcc="" class="pn-right"><!----> <div data-v-04ce5dcc="" class="btn"><!----> <span data-v-04ce5dcc="" class="">开始学习</span></div></div></div> <!----> <div data-v-5bb30488="" data-v-04ce5dcc=""><div data-v-5bb30488="" class="el-dialog__wrapper" style="display: none;"><div role="dialog" aria-modal="true" aria-label="dialog" class="el-dialog" style="margin-top: 15vh; width: 680px;"><div class="el-dialog__header"><span class="el-dialog__title"></span><!----></div><!----><!----></div></div></div> </div></div></div> <div data-v-6d176b95="" title="收藏" class="tag-item1"><img data-v-6d176b95="" src="" alt=""></div> <!----></div>

<body>
<form action="/insert" method="post">
    <input type="text" name="content">
    <input type="submit" th:value="发表">
</form>
<div th:each="comment:${all}">
    <div th:text="${comment.articleid}" style="display: none"></div>
    <div th:text="${comment.userid}" style="display: none"></div>
    <div style="border:3px solid black; width:400px">
    <p> 留言人：<span th:text="${comment.nickname}"></span>     留言时间：<span th:text="${comment.createdatetime}"></span></p>
    <div th:text="${comment.content}"></div>
    点赞人数<span th:text="${comment.likenum}"></span>
        <button><a th:href="@{/remove/(id=${comment.get_id()})}">删除</a></button>
    <div> <span th:if="${comment.replynum}"></span>
        <div  th:if="${comment.replynum}">
            <button>
                <a href="#" onclick="btn2()">回复</a>
            </button>
            <button>
            <a href="#" id="but" onclick="btn()"><span th:text="${comment.replynum}"></span>条——点击查看</a>
            </button>
            <div style="display: none" id="show2">
                        <form action="#" method="post">
                            <input type="text" name="content">
                            <input type="submit" value="回复">
                            <input type="button" value="关闭" onclick="btn3()">
                        </form>
            </div>
            <hr>
            <div id="show" style="display: none;text-indent: 4em">
                <p>回复人：<span th:text="${comment.nickname}"></span>     回复时间：<span th:text="${comment.createdatetime}"></span></p>
                <div th:text="${comment.content}"></div>
                <button>
                <a id="btn1" href="#" onclick="btn1()">收起</a>
                </button>
            </div>
        </div>
    </div>
    </div>
</div>
<script>
    function btn() {
        document.getElementById("show").style.display="block";
    }
    function btn1() {
        document.getElementById("show").style.display="none";
    }
    function btn2() {
        document.getElementById("show2").style.display="block";
    }
    function btn3() {
        document.getElementById("show2").style.display="none";
    }
</script>
</div>

</body>



</html>